{extend name="base" /}
{block name="body"}
<div class="layui-card">
    <div class="layui-card-header">
        <!-- 表格工具栏 -->
        <form class="layui-form toolbar">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <select name="cid">
                        <option value="">请选择栏目</option>
                        {foreach name="category" item="v"}
                        <option value="{$v.id}">{neq name="v.level" value="1"}|{php}for($i=1;$i<$v['level'];$i++){echo ' ----';}{/php}{/neq} {$v.name}</option>
                        {/foreach}
                    </select>
                </div>
                <div class="layui-inline">
                    <input name="keyword" class="layui-input" placeholder="请输入关键字" autocomplete="off"/>
                </div>
                <div class="layui-inline">&emsp;
                    <button class="layui-btn icon-btn" lay-filter="ListSearch" lay-submit>
                        <i class="layui-icon">&#xe615;</i>搜索
                    </button>
                </div>
            </div>
        </form>

    </div>

    <table id="tableList" lay-filter="tableList"></table>
    <!-- 表格操作列 -->
    <script type="text/html" id="tableTBTrack">
        <a href="{:url('admin/article/edit')}?id={{d.id}}&form={$form}" class="layui-btn layui-btn-sm">修改</a>
        <a href="{:url('admin/article/del')}?id={{d.id}}&form={$form}" class="layui-btn layui-btn-danger layui-btn-sm ajax-delete">删除</a>
    </script>
    <!-- 权限列 -->
    <script type="text/html" id="sort_order">
        <input type="text" name="sort_order" value="{{d.sort_order}}" autocomplete="off" class="layui-input ajax-update" data-url="{:url('admin/article/edit')}?id={{d.id}}&form={$form}">
    </script>
    <!-- 权限列 -->
    <script type="text/html" id="status">
        <input type="checkbox" name="status" lay-skin="switch" lay-filter="*" lay-text="发布|下架" data-url="{:url('admin/article/edit')}?id={{d.id}}&form={$form}" {{d.status==1?'checked':''}}>
    </script>
    <!-- 权限列 -->
    <script type="text/html" id="hot">
        <input type="checkbox" name="is_hot" lay-skin="switch" lay-filter="*" lay-text="是|否" data-url="{:url('admin/article/edit')}?id={{d.id}}&form={$form}" {{d.is_hot==1?'checked':''}}>
    </script>
    <!-- 权限列 -->
    <script type="text/html" id="tuijian">
        <input type="checkbox" name="is_tuijian" lay-skin="switch" lay-filter="*" lay-text="是|否" data-url="{:url('admin/article/edit')}?id={{d.id}}&form={$form}" {{d.is_tuijian==1?'checked':''}}>
    </script>

</div>
{/block}

{block name="js"}
<script>
    layui.use(['layer', 'form', 'table', 'util', 'dropdown'], function () {
        var table = layui.table;

        // 渲染回访表格
        var insTb = table.render({
            elem: '#tableList',
            url: "{:url('admin/article/index_json')}",
            where:{
                form:"{$form}",
            },
            page: true,
            toolbar: ['<p>',
                '<a href="{:url('admin/article/add',['form'=>$form])}" class="layui-btn layui-btn-sm">添加内容</a>',
                '<button lay-event="del" class="layui-btn layui-btn-sm layui-btn-danger">批量删除</button>',
                '</p>'].join(''),
            cellMinWidth: 100,
            limit:'15',
            limits:[15,30,50,100,200,500],
            even:true,
            cols: [[
                {type:'checkbox',title:'#'},
                {field: 'category_name', align: 'center', sort: true, title: '分类',width:120},
                {field: 'title', align: 'left', sort: true, title: '标题'},
                {field: 'create_time', align: 'center', sort: true, title: '创建时间',width:170},
                {align: 'center', sort: false, title: '排序',templet:'#sort_order',width:100},
                {align: 'center', sort: false, title: '热门?',templet:'#hot',width:90},
                {align: 'center', sort: false, title: '推荐?',templet:'#tuijian',width:90},
                {align: 'center', sort: false, title: '状态',templet:'#status',width:100},
                {align: 'center', toolbar: '#tableTBTrack', title: '操作', width: 190}
            ]],
            parseData: function(res){ //res 即为原始返回的数据
                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.data.total, //解析数据长度
                    "data": res.data.data //解析数据列表
                };
            }
        });
        /* 表格搜索 */
        form.on('submit(ListSearch)', function (data) {
            insTb.reload({where: data.field, page: {curr: 1}});
            return false;
        });

    });

</script>
{/block}